<template>
  <div id="left">
    <concise-introduce :author-info="authorInfo"/>
    <article-rank :ranks="latestArticles" title="近期文章" title-size="20"/>
    <advertisement/>
  </div>
</template>

<script>
import {ranks} from '../../data/ranks';
import ConciseIntroduce from "./ConciseIntroduce";
import ArticleRank from "../index/ArticleRank";
import Advertisement from "../index/Advertisement";
export default {
  name: "AuthorInfo",
  components:{ConciseIntroduce,ArticleRank,Advertisement},
  props:{
    latestArticles:{type:Array,default:ranks},
    authorInfo:{type:Object,default: null}
  },
  data(){
    return {
    }
  }
}
</script>

<style scoped>
#left{
  position: sticky;
  bottom:0;
  padding:10px;
  box-shadow: 1px 1px 2px 2px #d0d2d1,
              -1px -1px 2px 2px #d0d2d1;
}
</style>
